<template>
  <div>
    <el-table :data="list" style="width: 100%" stripe highlight-current-row>
      <el-table-column
        prop="studentId"
        label="学生id"
        header-align="center"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop="english"
        label="英语"
        header-align="center"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop="math"
        label="数学"
        header-align="center"
        align="center"
      >
      </el-table-column>
      <el-table-column label="操作" header-align="center" align="center">
        <template slot-scope="scope">
          <el-button
            type="danger"
            icon="el-icon-delete"
            size="mini"
            circle
            @click="removeById(scope.row.studentId)"
          ></el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
import { scoreList } from "../data/data";

export default {
  name: "Score",
  data() {
    return {
      list: scoreList,
    };
  },
  methods: {
    removeById(id) {
      this.list.splice(this.getIndexById(id), 1);
      this.$message.success("删除成功！");
    },
    getIndexById(id) {
      var s = this.list.filter((p) => {
        return p.id == id;
      });

      if (s != null) {
        return this.list.indexOf(s[0]);
      } else {
        alert("未找到数据！");
        return -1;
      }
    },
  },
};
</script>
